<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<title>iBill</title>
<link href="stylesheets/front.css" media="screen, projection" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" media="screen" href="stylesheets/dock.css">
<script src="javascripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="javascripts/jquery.jqDock.min.js"></script>
	<script type="text/javascript">
		$(function(){
			var jqDockOpts = {align: 'left', duration: 200, labels: 'tc', size: 48, distance: 85};
			$('#jqDock').jqDock(jqDockOpts);
		});
	</script>
</head>
<body>
<%@ page import="edu.cmu.ibill.databeans.User" %>


<div id="logo"></div>

<div id="container">
<%
User user = (User) session.getAttribute("user");
	if (user == null) {
%>
  <div id="topnav" class="topnav"> Have an account? <a href="login" class="signin"><span>Sign in</span></a> New to iBill? <a href="register" class="register"><span>Register</span></a></div>
  <fieldset id="signin_menu">
	<%
	java.util.List<String> loginerrors = (java.util.List) request.getAttribute("loginerrors");
	if (loginerrors != null && loginerrors.size() > 0) {
	%>
	<p class="error">
	<%
		for (String error : loginerrors) {
	%>
			<%=error%><br/>
	<%
		}
	%>
	</p>
	<%
	}
	%>
    <form method="post" id="signin" action="login.do">
      <label for="username">Email</label>
      <input id="email" name="email" value="${email}" title="Email" tabindex="4" type="text">
      </p>
      <p>
        <label for="password">Password</label>
        <input id="password" name="password" value="" title="password" tabindex="5" type="password">
      </p>
      <p class="remember">
        <input id="signin_submit"  name="Button" value="Login" tabindex="6" type="submit">
        <input id="remember" name="remember_me" value="1" tabindex="7" type="checkbox">
        <label for="remember">Remember me</label>
      </p>
      <p class="forgot"> <A id=resend_password_link title="Click to reset your password" href="#">Forgot your password?</A> </p>
	<%
		if(request.getAttribute("logininprocess")!= null){
	%>
	<script type="text/javascript">
		$(".signin").addClass("menu-open");
	</script>
	<%
		}
	%>
    </form>
  </fieldset>
  
  <fieldset id="register_menu">
	<%
    java.util.List<String> errors = (java.util.List) request.getAttribute("registererrors");
	if (errors != null && errors.size() > 0) {
	%>
	<p class="error">
	<%
		for (String error : errors) {
	%>
			<%=error%><br/>
	<%
		}
	%>
	</p>
	<%
	}
	%>
    <form method="post" id="register" action="register.do">
      <label for="username">Email</label>
      <input id="registeremail" name="registeremail" value="${registeremail}" title="Email" tabindex="4" type="text">
      </p>
      <p>
        <label for="password">Password</label>
        <input id="password" name="password" value="" title="Password" tabindex="5" type="password">
      </p>
	  <p>
        <label for="confirmpassword">Confirm Password</label>
        <input id="confirmpassword" name="confirmpassword" value="" title="Confirm Password" tabindex="6" type="password">
      </p>
	  <p>
        <label for="firstname">First Name</label>
        <input id="firstname" name="firstname" value="${firstname}" title="First Name" tabindex="7" type="text">
      </p>
	  <p>
        <label for="lastname">Last Name</label>
        <input id="lastname" name="lastname" value="${lastname}" title="Last Name" tabindex="8" type="text">
      </p>
	  <p>
		<input id="register_submit" name="Button" value="Register" tabindex="9" type="submit"  >
	  </p>
    </form>
	<%
		if(request.getAttribute("registerinprocess")!= null){
	%>
	<script type="text/javascript">
		$(".register").addClass("menu-open");
	</script>
	<%
		}
	%>
  </fieldset>
 <%
}else{
%>
<div id="topnav" class="topnav"> Welcome <%=user.getUserName()%> <a href="logout.do" class="logout"><span>Log out</span></a></div>

<!-- dock -->
<div id="dockContainer">
	<ul id="jqDock">
		<li><a class="dockItem" href="showallbill.do"><img src="images/dock/home-sm.png" alt="Home" title="Home" /></a></li>
		<li><a class="dockItem" href="showaccountsummary.do"><img src="images/dock/portfolio-sm.png" alt="Summary" title="Summary" /></a></li>
		
		<li><a class="dockItem" href="report.do"><img src="images/dock/summary-sm.png" alt="Statitiscs" title="Statitiscs" /></a></li>
		
		<li><a class="dockItem" href="setting.do"><img src="images/dock/settings-sm.png" alt="Settings" title="Settings" /></a></li>
	</ul>
</div>
<!-- end dock -->
<%
}
%>
</div>


<script type="text/javascript">
        $(document).ready(function() {

            $(".signin").click(function(e) {          
				e.preventDefault();
                $("fieldset#signin_menu").toggle();
				$(".signin").toggleClass("menu-open");
            });
			
			$("fieldset#signin_menu").mouseup(function() {
				return false
			});
			$(document).mouseup(function(e) {
				if($(e.target).parent("a.signin").length==0) {
					$(".signin").removeClass("menu-open");
					$("fieldset#signin_menu").hide();
				}
			});		

			
			$(".register").click(function(e) {          
				e.preventDefault();
                $("fieldset#register_menu").toggle();
				$(".register").toggleClass("menu-open");
            });
			
			$("fieldset#register_menu").mouseup(function() {
				return false
			});
			$(document).mouseup(function(e) {
				if($(e.target).parent("a.register").length==0) {
					$(".register").removeClass("menu-open");
					$("fieldset#register_menu").hide();
				}
			});
			
			if($(".signin").hasClass("menu-open")){
				$(".signin").click();
			}
			
			if($(".register").hasClass("menu-open")){
				$(".register").click();
			}
			
        });
</script>
<script src="javascripts/jquery.tipsy.js" type="text/javascript"></script>
<script type='text/javascript'>
    $(function() {
	  $('#resend_password_link').tipsy({gravity: 'w'});   
    });
  </script>
  <div id="pagecontent" class="pagecontent" align="center">